<template>
	<view>
		<view class="rowsc" style="margin-top: 150rpx;">
			<image src="../../static/logo.png" mode="" style="height: 150rpx;width: 150rpx;" class="radius"></image>
		</view>
		<view class="text-bold text-xl text-center margin-top">
			启程驾校
		</view>
		<view class="padding">
			<view class="text-lg">
				手机号
			</view>
			<view class="margin-top">
				<input type="text" value="" placeholder="请输入手机号" class="border-bottom" v-model="phone" />
			</view>
		</view>
		<view class="padding">
			<view class="text-lg">
				密码
			</view>
			<view class="margin-top">
				<input type="text" value="" placeholder="请输入密码" class="border-bottom" v-model="password" />
			</view>
		</view>
		<view class="padding">
			<view class="text-lg">
				有效验证码
			</view>
			<view class="margin-top border-bottom rowsb padding-bottom-sm align-center">
				<input type="text" value="" placeholder="验证码" v-model="code" />
				<text @click="getCodeByPhone" v-if="!count">获取验证码</text>
				<text v-else>
					{{count}}
				</text>
			</view>
		</view>
	 
		<view class="rowsc padding" @click="submitLoginReg">
			<view style=" margin-top: 10rpx;width: 100%;background-color: #0054A7;color: white;" class="padding-sm radius  text-center text-xl " @click="submitMen">
				注册
			</view>
		</view>
		<view class="justify-end padding-right text-sm padding-top" @click="login">
			已有账号去登录>
		</view>
	</view>
</template>

<script>
	import {
		loginreg,
		getCodeByPhone
	} from '../../common/path.js'
	export default {
		data() {
			return {
				phone: '',
				password: '',
				count: '',
				code: ''
			}
		},
		methods: {
			//提交
			submitLoginReg() {
				if (this.phone.length != 11) {
					this.$tools.showToast('请输入正确手机号')
				} else if (this.password == '') {
					this.$tools.showToast('请输入密码')
				} else if (this.code == '') {
					this.$tools.showToast('请输入有效验证码')
				} else {
					this.loginreg()
				}
			},
			//注册
			loginreg() {
				let data = {
					tel: this.phone,
					password: this.password,
					code: this.code
				}
				this.$axios.axios("POST", loginreg, data)
					.then(res => {
						if (res.status == 1) {
							this.$tools.showToast('注册成功！')
							setTimeout(r => {
								uni.navigateTo({
									url: 'login'
								})
							}, 1000)
							console.log(res)
						}
					})
					.catch(err => {
						console.log(err)
					})
			},

			getCodeByPhone() {
				if (this.phone.length == 11) {
					let data = {
						tel: this.phone
					}
					this.$axios.axios("POST", getCodeByPhone, data)
						.then(res => {
							console.log(res)
							if (res.status == 1) {
								this.$tools.showToast('发送成功')
								this.getCode()
							}
						})
						.catch(err => {
							console.log(err)
						})
				} else {
					this.$tools.showToast('请输入正确的手机号！')
				}

			},


			//倒计时
			getCode() {
				const TIME_COUNT = 60;
				if (!this.timer) {
					this.count = TIME_COUNT;
					this.show = false;
					this.timer = setInterval(() => {
						if (this.count > 0 && this.count <= TIME_COUNT) {
							this.count -= 1;
						} else {
							this.show = true;
							clearInterval(this.timer);
							this.timer = null;
						}
					}, 1000);
				}
			},
			login() {
				uni.navigateTo({
					url: 'login'
				})
			}
		}
	}
</script>

<style>
	page {
		background-color: #FFFFFF;
	}
</style>
